<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <title>搜索结果-天天装机</title>
    <meta name="applicable-device" content="pc">
<link rel="stylesheet" href="css/result.css" type="text/css" th:href="@{/asserts/css/result.css}" />
<link rel="stylesheet" href="css/main.css" type="text/css" th:href="@{/asserts/css/main.css}" />
</head>
<body>
<!-- header -->
<div th:insert="~{ttzj/homepage :: menu}"></div>


<h3 style="margin-left: 13%;margin-top: 20px; margin-bottom: 10px;">共检索到<span th:text="${count}">5</span> 条关于"<span th:text="${keyword}">关键字</span>"的记录：</h3>
<div class="aresult">
   <span id="aspan" style="font-size: 25px;">没有相关的文章记录 (￣o￣) . z Z</span>
   <table class="atable" id="atable">
      <tr>
          <th width="75%">标题</th>
          <th>发布人</th>
      </tr>
     <tr th:each="article:${articles}">
         <td><a th:href="@{/forum/detail(id=${article.articleId})}"><p th:text="${article.title}">文章标题</p></a></td>
         <td><a th:href="@{/userInfo(name=${article.userName})}"><p th:text="${article.userName}">用户名</p></a></td>
     </tr>
   </table>
</div>
<div class="uresult">
  <span id="uspan" style="font-size: 25px;">没有相应的用户记录 (￣o￣) . z Z</span>
  <table class="utable" id="utable">
     <tr th:each="user:${users}">
         <td width="20%"><a th:href="@{/userInfo(name=${user.name})}"><img src="img/test.jpg" th:src="${user.src}" height="40" width="40" style ="border-radius:50% ;border: 1px solid #6d6d6d;"></a></td>
          <td width="60%" th:text="${user.name}">用户名</td>
     </tr>
     </table>
</div>

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>

window.onload=function(){
isAEmpty();
isUEmpty();
}
function isAEmpty(){
 var atable = $("#atable");
 var aspan = $("#aspan");
 var a = atable.find("tr").length;
 if (a == 1) {
 	atable.css('display','none'); 
    aspan.css('display','block'); 
 }else{
    aspan.text("相关文章记录:"); 
 }
};

function isUEmpty(){
 var utable = $("#utable");
 var uspan = $("#uspan");
 var u = utable.find("tr").length;
 if (u == 0) {
  utable.css('display','none'); 
    uspan.css('display','block'); 
 }else{
    uspan.text("相关用户记录:"); 
 }
};

</script>
</body>
</html>
